import styles from "./index.module.scss";
import EchartsEL from "./echartsEL";
import { useSelector } from "react-redux";
import { useEffect, useState } from "react";

export default function EnterLeave() {
  const seriesData = [
    {
      name: "重庆",
      num1: 100,
      num2: 100,
    },
    {
      name: "四川",
      num1: 100,
      num2: 100,
    },
    {
      name: "深圳",
      num1: 100,
      num2: 100,
    },
    {
      name: "北京",
      num1: 150,
      num2: 50,
    },
    {
      name: "上海",
      num1: 120,
      num2: 70,
    },
    {
      name: "成都",
      num1: 120,
      num2: 70,
    },
  ];
  const legendArr = ["入职", "离职"];
  const colorArr = [
    [
      "rgba(0, 147, 221, 1)",
      "rgba(0, 88, 255, 0.20)",
      "rgba(0, 114, 221, 1)",
      "rgba(255, 255, 255, 1)",
      "rgba(10, 49, 108, 0.60)",
      "rgba(27, 101, 155, 0.60)",
    ],
    [
      "rgba(0, 221, 88, 1)",
      "rgba(0, 255, 87, 0.20)",
      "rgba(0, 126, 51, 1)",
      "rgba(255, 255, 255, 1)",
      "rgba(10, 108, 37, 0.60)",
      "rgba(27, 155, 55, 0.60)",
    ],
  ];
  const theme = useSelector((state) => state.theme);

  return (
    <>
      <div className={styles.profit}>
        <div className={styles.profitRight}>
          <EchartsEL
            colorArr={colorArr}
            seriesData={seriesData}
            legendArr={legendArr}
            textColor={theme ? "rgba(37, 76, 112, 1)" : "#fff"}
          ></EchartsEL>
        </div>
      </div>
    </>
  );
}
